(function (window) {
	'use strict';

<<<<<<< HEAD
	// 声明一个对象,存储所有进行事项类别删选的函数
	let filters = {
		all(todos){ 
			return todos;
		},
		active(todos){
			return todos.filter( todo => !todo.completed)
		},
		completed(todos){
			return todos.filter( todo => todo.completed)
		}
	}

	// 声明常量用于存储本地存储中保存事项的键
	const TODOS_KEY = 'todos_vue';
	// 声明对象统一保存本地存储的处理功能
	let todoStorage = {
		get(){
			return JSON.parse(localStorage.getItem(TODOS_KEY)) || [];
		},
		set(todos){
			localStorage.setItem(TODOS_KEY, JSON.stringify(todos));
		}
	}

	new Vue({
		el: "#app",
		data: {
			// todos: [
			// 	{ id: 1, title: '示例内容1', completed: true },
			// 	{ id: 2, title: '示例内容2', completed: false },
			// 	{ id: 3, title: '示例内容3', completed: false },
			// ],
			todos: todoStorage.get(),
			newTodo: "",
			// 存储正在编辑的todo
			editingTodo: null,
			titleBeforeEdit: '',
			// 存储要显示的事项类别
			todoType: 'all'
		},
		computed: {
			// 进行事项删选处理
			filteredTodo(){
				return filters[this.todoType](this.todos)
			},
			remaining() {
				// return this.todos.filter(todo => !todo.completed).length
				return filters.active(this.todos).length;
=======
	new Vue({
		el: "#app",
		data: {
			todos: [
				{ id: 1, title: '示例内容1', completed: true },
				{ id: 2, title: '示例内容2', completed: false },
				{ id: 3, title: '示例内容3', completed: false },
			],
			newTodo: "",
			// 存储正在编辑的todo
			editingTodo: null,
			titleBeforeEdit: ''
		},
		computed: {
			remaining() {
				return this.todos.filter(todo => !todo.completed).length
>>>>>>> fa3ee7ba3aa117b7621bd11de2c8689e27e764f9
			},
			allDone: {
				get() {
					return this.remaining === 0;
				},
				//value代表全部切换选框的状态
				set(value) {
					this.todos.forEach(todo => {
						todo.completed = value;
					});
				}

			}
		},
<<<<<<< HEAD
		watch:{
			todos:{
				deep: true,
				handler: todoStorage.set
			}
		},
=======
>>>>>>> fa3ee7ba3aa117b7621bd11de2c8689e27e764f9
		methods: {
			pluralize(word) {
				return word + (this.remaining === 1 ? '' : 's');
			},
			addTodo(){
				if(!this.newTodo.trim()){
					return;
				}
				this.todos.push({
					id: this.todos.length + 1,
					title: this.newTodo.trim(),
					completed: false
				});
				this.newTodo = "";
			},
			removeTodo(todo){
				console.log(todo);
				this.todos.splice(this.todos.indexOf(todo),1);
			},
			removeCompleted(){
<<<<<<< HEAD
				// this.todos = this.todos.filter(todo => !todo.completed)
				this.todos = filters.active(this.todos);
=======
				this.todos = this.todos.filter(todo => !todo.completed)
>>>>>>> fa3ee7ba3aa117b7621bd11de2c8689e27e764f9
			},
			eidtTodo( todo ){
				this.editingTodo = todo;
				this.titleBeforeEdit = todo.title
			},
			cancelEdit(todo){
				this.editingTodo = null,
				todo.title = this.titleBeforeEdit;
			},
			// 保存编辑
			editDone( todo ){
				if(!this.editingTodo){
					return;
				}
				this.editingTodo = null;
				let value =  todo.title.trim()
				if(!value){
					this.removeTodo(todo);
				}
				todo.title = value;
			}
		},
		directives:{
			// 用于设置正在编辑的事项输入框获取焦点
			'todo-focus'(el, binding){
				if(binding.value){
					el.focus();
				}
			}
		}
	})

})(window);
